#prompts {
  position: fixed;
  width: 290px;
  z-index: 20;
  top: 72px;
  left: 70px;
}

.prompt {
  &:extend(.dropdown-shadow);
  position: absolute;
  width: 100%;
  padding: 15px;
  background: #fff;
  border: 1px solid #dadada;
  border-radius: 4px;

  &:before {
    content: '';
    position: absolute;
    top: -8px;
    left: 43px;
    width: 12px;
    height: 12px;
    z-index: 3;
    width: 0;
    height: 0;
    border-left: 8px solid transparent;
    border-right: 8px solid transparent;
    border-bottom: 8px solid #fff;
  }

  p {
    margin-top: 0;
    font-weight: 500;
    font-size: 12.5px;
    word-break: break-word;

    &.perm {
      font-weight: 400;

      &::first-letter {
        text-transform: uppercase;
      }

      i {
        margin-right: 3px;
        color: #777;
        font-size: 13px;
      }
    }
  }
    
  .perm-experimental {
    display: flex;
    background: @background-message--primary;
    color: @color-message--primary;
    font-size: 12.5px;

    // this is positioned with negative margins so that it goes up to the edges of the prompt
    padding: 10px;
    margin: 15px -15px -15px;

    i {
      color: @color-message--primary;
      padding-right: 8px;
      padding-top: 5px;
    }
  }

  a {
    &:extend(.link);
    &:hover {
      &:extend(.link:hover);
    }
  }

  .prompt-btns {
    text-align: right;

    button {
      margin-left: 5px;
    }
  }
}